<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/common.jsp" %>
<%@ include file="/WEB-INF/jsp/frm/workflow/startpanel/process-start.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>公用业务发起页面</title>
	<script src="${pageContext.request.contextPath}/resource/js/gacx/workflow/elecmanage/elec_apply.js"></script>
<!-- 电子公函申请新增 -->
 <link href="${pageContext.request.contextPath}/resource/css/def/ztree/metro.css" rel="stylesheet">
  	<link href="${pageContext.request.contextPath}/resource/css/def/bootstrap/ace/ace-part2.min.css" rel="stylesheet">
  	<link href="${pageContext.request.contextPath}/resource/css/def/bootstrap/ace/ace.css" rel="stylesheet">
  	<link href="${pageContext.request.contextPath}/resource/css/def/frm/common/common.css" rel="stylesheet">
  	<script src="${pageContext.request.contextPath}/resource/js/jquery/plugin/handlebars-v3.0.1.js"></script>
  	<script src="${pageContext.request.contextPath}/resource/js/bootstrap/validator/bootstrapValidator.js"></script>
  	 <link href="${pageContext.request.contextPath}/resource/css/index.css" rel="stylesheet">
  	 <script src="${prcs}/js/jquery/plugin/My97DatePicker/WdatePicker.js"></script>
     <script type="text/javascript" src="${pageContext.request.contextPath}/resource/js/jquery/plugin/jquery.ztree.all-3.5.min.js"></script>
     <script type="text/javascript" src="${pageContext.request.contextPath}/resource/js/jquery/plugin/ajaxfileupload.js"></script>
     <script type="text/javascript" src="${pageContext.request.contextPath}/resource/js/frm/sys/disOrgTree.js"></script>
     <link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/resource/css/dzgh/info_publish.css">
</head>
<script type="text/javascript">
 window.onload = function(){ 
	if(null == $("#dzghForm").data('bootstrapValidator')) {
		$("#dzghForm").bootstrapValidator(checkValidator);
	}
	resetValidator();
} 
function resetValidator(){
	if($("#dzghForm").data('bootstrapValidator')){
		$("#dzghForm").data('bootstrapValidator').resetForm(false);
	}
}
var checkValidator = {
		message: 'This value is not valid',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
    	submitHandler: function(validator, form, submitButton) {
    		 if(checkNum()){
    		   showStartPanel();
    		   //$("#saveBtn").removeAttr("disabled");
    		   $("#saveBtn").attr("disabled",false);
    		 }
    	},
        fields: {
        	sel_staff_name:{
				validators: {
					 notEmpty :{message: '<font color="red">请输入'+'办案人员</font>'}
				}	
			},
			num:{
				validators: {
					 notEmpty :{message: '<font color="red">请输入'+'检验号码清单</font>'}
				}	
			},
			name:{
				validators: {
					 notEmpty :{message: '<font color="red">请输入'+'案件名称</font>'}
				}	
			},
			valid_start_date:{
				validators: {
					 notEmpty :{message: '<font color="red">请输入'+'检验时效开始时间</font>'}
				}	
			},
			valid_end_date:{
				validators: {
					 notEmpty :{message: '<font color="red">请输入'+'检验时效结束时间</font>'}
				}	
			},
        }
}
//关闭当前页面
function closeAddPage(){
	window.close();
} 

function callBackJy(staffid,staffnames){
	$("#sel_staff_name").val(staffnames);
	$("#sel_staff_id").val(staffid);
	if($("#dzghForm").data("bootstrapValidator")){
		 $("#dzghForm").data("bootstrapValidator").updateStatus("sel_staff_name", "NOT_VALIDATED", null).validateField("sel_staff_name");
	  }
} 
//输入号码验证
function checkNum(){ 
	var importType = $("input[name='importType']:checked").val();
	if("0"==importType){
	var nums = $.trim($("#num").val());
	if(""==nums){
		alert("检验号码清单不能为空");
	    $("#saveBtn").attr("disabled",true);
	    return false;
	}
	if(nums.lastIndexOf(";")==nums.length-1)
		nums = nums.substring(0,nums.length-1);
	var result=nums.match(/^[;0-9]+$/); 
	var arr = nums.split(";");	
	if(result==null) {
    alert("检验号码清单只能包含数字和英文（;）");
    $("#saveBtn").attr("disabled",true);
    return false;
	}
	else if(mm(arr)){
	alert("检验号码清单包含了重复号码");
	$("#saveBtn").attr("disabled",true);
	return false;
	}
	for(var i in arr){
		if(""==arr[i]){
			alert("检验号码清单内存在空号码");
			$("#saveBtn").attr("disabled",true);
			return false;
		}
		if (!arr[i].match(/^1[34578]\d{9}$/)) { 
			alert("检验号码清单存在格式异常的号码！");
			$("#saveBtn").attr("disabled",true);
			return false; 
			} 
	}
	 }
	else{
		var fileName = $("#fileName").val();
		if(null==fileName||""==fileName){
			alert("请先上传文件");
			return false;
		}
	}
	return true;
		
}
//验证数组内是否包含重复数据
function mm(a)
{
   return /(\x0f[^\x0f]+)\x0f[\s\S]*\1/.test("\x0f"+a.join("\x0f\x0f") +"\x0f");
}
function exchange(obj){
	var fileName =  $("#fileName").val();
	if("0"==obj.value){
	    if(""!=fileName){
	    	alert("存在上传成功的文件，请先删除！");
	    	 $(":radio[name='importType'][value='1']").prop("checked", "checked");
	    	return;
	    }
		checkValidator.fields.num.validators = {
			notEmpty :{message: '<font color="red">请输入'+'检验号码清单</font>'}
		};
		if($("#dzghForm").data("bootstrapValidator")){
			 $("#dzghForm").data("bootstrapValidator").updateStatus("num", "NOT_VALIDATED", null).validateField("num");
		  }
		$("#wj").css('display','none'); 
		$("#nofile").css('display','');
		$("#fileName").val("");
	}
	else{
		//动态修改某一字段的验证方式
		checkValidator.fields.num.validators = {
			};
		if($("#dzghForm").data("bootstrapValidator")){
			 $("#dzghForm").data("bootstrapValidator").updateStatus("num", "NOT_VALIDATED", null).validateField("num");
		  }
		$("#wj").css('display',''); 
		$("#nofile").css('display','none');
	}
}
//执行刷新验证
function dateSelect(){
	if($("#dzghForm").data("bootstrapValidator")){
		 $("#dzghForm").data("bootstrapValidator").updateStatus("valid_start_date", "NOT_VALIDATED", null).validateField("valid_start_date");
	  }
	if($("#dzghForm").data("bootstrapValidator")){
		 $("#dzghForm").data("bootstrapValidator").updateStatus("valid_end_date", "NOT_VALIDATED", null).validateField("valid_end_date");
	  }
}
/* $(function() {
	  $("#uploadValue").click(function() {
	    $("#myfile").click();
	  });
	  setInterval(function() {
	    $("#photoCover").val($("#myfile").val());
	  }, 1);
	}); */
//点击上传  上传附件
var attachment = "", oldattachment = "";
function uploadAttachment() {
  //debugger;
  var myfile = $("#myfile").val();
  var id = document.getElementById("elec_id").value;
  if (myfile == "") {
		 alert("请选择需要上传的文件");
  }else{
	  var dom = document.getElementById("myfile");
	  var fSize;
	  if(dom.files)
		  fSize =  dom.files[0].size;
	  else
		  fSize = 10;
      var MB = (100*1024*1024).toString();
	  if(fSize>MB){
		  alert("上传文件大小超出限制,请上传小于100M的文件");  
	  }else{ 
	    $.ajaxFileUpload({
	      url: "../dzghApplyController/uploadAttachment.action",
	      type: "post",
	      data: { elec_id: id},
	      fileElementId: "myfile",
	      dataType: "text/html",
	      success: function(data) {
	        var dataObj = eval('(' + data + ')');
		          // 获取上传文件的原文件名
		          alert(dataObj.msg);
		          var oldname = dataObj.oldname;
		          var size = dataObj.size;
		          var newname = "newname";
		          $("#fileName").val(oldname);
		          var msg = dataObj.msg;
		          // 在ul列表中展示原文件名
		          var attaContent = "<li id='conttt' style='width:440px;padding-top:12px;' class='list-group-item' filename='" 
		          + newname 
		          + "'><div style= ' cursor:pointer; float:left; width:275px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; margin: 0 ' title='"+oldname+"'>"
					+msg
					+"</div>"
					+"&nbsp;<a op='del' style='height:30px;width:80px;float: right;cursor:pointer;margin-right:-20px;' filename='" 
		          + newname 
		          + "'><img src='${pageContext.request.contextPath}/resource/images/trash.png' style='margin-top:-4px;'> 删除</a></li>";
		          // 将上传文件的uuid名封装在 attachment 变量中
		          //attachment += newname + ",";
		         // oldattachment += oldname + ",";
		          //$("#fi1").hide();
		          $("#files").append(attaContent);
		          // 提交form表单时将 封装有上传文件名的 attachment 添加到隐藏域中 
		          //$("#attachment").val(attachment);
		          //$("#oldattachment").val(oldattachment);
		         // $("#photoCover").val();
		         // $("#uploadValue").attr("disabled", true);
		          $("#myfile").attr("disabled", true);
		          $("#upload").attr("disabled", true);
		          $("#saveBtn").attr("disabled", false);
		          delFile();
			}
	    });
	  }
  }
}
function delFile() {
  $("a[op]").unbind();
  $("a[op]").click(function() {
	var id = document.getElementById("elec_id").value;
    var deldeldel = $(this);
    if (confirm("确认要删除该附件吗?")) {
      $.ajax({
        url: "../dzghApplyController/delAttachment.action ",
        data: "elec_id=" + id,
        dataType: "json",
        type: "post",
        success: function(data) {
          if (data) {
            deldeldel.parent().remove();
            $(this).parent().remove();
            //$("#uploadValue").attr("disabled", false);
            $("#myfile").attr("disabled", false);
            $("#upload").attr("disabled", false);
            $("#fileName").val("");
            alert("删除成功");
          } else {
            alert("删除失败");
          }
        }
      });
    }
  });
}
</script>
<body>
	<!--<div>
		 <p>业务页面</p> -->
		<!-- 业务页面所必须的流程Key定义 -->
		<!-- <select id="processDefinitionKey" name="processDefinitionKey">
			<option value="GaWorkflow">电子公函申请</option>
			<option value="ReleasePoint">普通审批</option>
			<option value="Vote">投票会签</option>
		</select>   
	</div>-->
	<div style="height:100%;" class="main-content">
				<div class="page-content" style="background: #fff">
				<form class="form-horizontal"  role="form" id="dzghForm" autocomplete="off" enctype="multipart/form-data">
				<input type="hidden" id="processDefinitionKey" name="processDefinitionKey" value="GaWorkflow"/>
		        <input type="hidden" id="assigneeDz" name="assigneeDz"/>
		        <input type="hidden" id="taskDefinitionKey" name="taskDefinitionKey"/>
					<div class="head-title"><span>电子公函申请</span></div>
					<div class="check-div">
						<div class="row check-row apply-row">
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">电子公函编号 </span>
									<input type="text" value="${bean.elec_id}" id="elec_id" name="elec_id" class="form-control" placeholder="GHBH20170502163600123"
										   readonly/>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">案件名称 </span>
									<input type="text" class="form-control" name="name" placeholder="请输入案件名称">
								</div>
							</div>
						</div>
						<div class="row check-row apply-row">
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">申请省份</span>
									<input type="text" class="form-control" value="${bean.prov_name}" name="prov_name" placeholder="山东省"
										   readonly/>
									 <input type="hidden"  value="${bean.prov}" name="prov" />
								</div>
							</div>
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">申请地市</span>
									<input type="text" class="form-control" value="${bean.eparchy_name }" name="eparchy_name" placeholder="济南市"
										   readonly/>
									<input type="hidden"  value="${bean.eparchy_code }" name="eparchy_code"/>
								</div>
							</div>
						</div>
						<div class="row check-row apply-row">
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">申请人员</span>
									<input type="text" class="form-control" value="${bean.apply_staff_name }" name="apply_staff_name" placeholder="警员A"
										   readonly/>
								    <input type="hidden"  value="${bean.apply_staff_id }" name="apply_staff_id" />
								</div>
							</div>
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">警员编号</span>
									<input type="text" class="form-control" value="${bean.jybh }" name="jybh" placeholder="JYBH0000123"
										   readonly/>
								</div>
							</div>
						</div>
						<div class="row check-row apply-row">
						<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">申请单位</span>
									<input type="text" class="form-control" value="${bean.org_name}" name="org_name" placeholder="济南市公安局"
										   readonly/>
									<input type="hidden"  value="${bean.org_id}" name="org_id"/>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">办案人员</span>
									<input type="text" class="form-control"  id="sel_staff_name" name="sel_staff_name" onclick="selectSameOrgStaff('${bean.org_code}','2',callBackJy,2)" placeholder="请选择办案人员"/>
								    <input type="hidden" id="sel_staff_id" name="sel_staff_id"/>
								</div>
							</div>
						</div>
						<div class="row check-row apply-row">
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">检验时效</span>
									<input type="text" class="form-control" name="valid_start_date" id="valid_start_date" onFocus="WdatePicker({onpicked:function(dp){dateSelect();},skin:'whyGreen',dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'valid_end_date\')||\'2090-10-01\'}'})">
								</div>
							</div>
							<div class="col-sm-6">
								<div class="input-group">
									<span class="input-group-addon">至</span>
									<input type="text" class="form-control" name="valid_end_date" id="valid_end_date" onFocus="WdatePicker({onpicked:function(dp){dateSelect();},skin:'whyGreen',dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'valid_start_date\')}',maxDate:'2090-10-01'})">
								</div>
							</div>
						</div>
						<div class="row apply-row" style="height: 52px;">
							<div class="col-sm-12">
								<div class="input-group">
									<span class="input-group-addon">申请描述</span>
									<textarea  class="form-control" name="apply_desc" readonly="readonly"
											  placeholder="根据《中华人民共和国刑事诉讼法》第五十二条之规定，我局侦办的本案件，需调取你处下列电话号码有关证据，请配合执行！伪造证据、隐匿证据或者毁灭证据的，将受法律追究。"
											  >根据《中华人民共和国刑事诉讼法》第五十二条之规定，我局侦办的本案件，需调取你处下列电话号码有关证据，请配合执行！伪造证据、隐匿证据或者毁灭证据的，将受法律追究。</textarea>
								</div>
							</div>
						</div>
						<div class="row apply-row">
							<div class="col-sm-12">
								<div class="input-group">
									<span class="input-group-addon">核验号码清单</span>
									<div class="form-control" style="position:static; float: none; clear: both;">
										<div>
											<div id="uploader" class="wu-example">
												<div id="thelist" class="uploader-list"></div>
												<div class="btns" style="margin-bottom:10px;margin-top:10px;">
													<label class="radio-inline">
														<input type="radio" name="importType" id="inlineRadio1" onclick="exchange(this);" checked="checked" value="0"> 手动上传
													</label>
													<label class="radio-inline">
														<input type="radio" name="importType" id="inlineRadio2" onclick="exchange(this);" value="1"> 文件上传
													</label>
												</div>
											</div>
                            <div id="nofile">
											<table class="table table-bordered apply-hover"
												   style="margin-bottom: 0px;">
												<thead>
												<tr>
													<th style="color:#6fb3e0;text-align: center;">如需手动输入号码请用；(英文分号)隔开</th>
												</tr>
												</thead>
											</table>
											<textarea class="table" id="num"  name="num"  style="height:100px;border-top: none;"></textarea>
							</div>
							<div id="wj" style="display:none">										
								<div style="padding-top: 5px;">
								
								<div class="input-append"  >
								<input type="file" name="myfile" id="myfile" style="height: 30px; width: 250px;display:inline"/>
									<!-- <input id="photoCover" class="input-large" type="text"
										name="uploadname" style="height: 30px;width:232px;"
										placeholder="请选择您要上传的文件"> <a class="btn btn-default"
										id="uploadValue" style="height: 30px; width: 100px;">浏览...</a> -->
										<button id="upload" onclick="uploadAttachment()" type="button"
										class="btn btn-default" style="height: 30px; width: 100px;display:inline">上传</button>
								</div>
								<div style="margin-top: 15px;">
								    <input type="hidden" id="fileName"/>
									<ul id="files" class="updata_fibox" ></ul>
								</div>
								<div>
							    </div>
								</div>
							</div>
									</div>
								</div>
							</div>
						</div>
						<div class="modal-footer">
							<button type="submit" id="saveBtn"   class="btn btn-info">发&nbsp;&nbsp;起</button>
							<!-- <button id="showPanel" type="button" class="btn btn-success" onclick="showStartPanel();">发起</button>  -->
						</div>
					</div>
					</div>
            </form>
				</div>
			</div>
</body>
</html>